<!--
 * @Description: 会议列表
 * @Author: wind-lc
 * @version: 1.0
 * @Date: 2021-08-24 17:53:44
 * @LastEditTime: 2023-02-03 17:52:22
 * @FilePath: \cscec-pms-admin\src\components\Meeting\MeetingList.vue
-->
<template>
  <div>
    <!-- 搜索 -->
    <searchData
      :search-data="searchOption"
      @search="search"
    />
    <!-- 搜索 -->
    <!-- 会 -->
    <a-card>
      <!-- 表格操作 -->
      <!-- <div class="table-operator">
        <title-name :title="$route.meta.title+'列表'" />
      </div> -->
      <!-- 表格操作 -->
      <!-- 表格 -->
      <list-table
        ref="table"
        :columns="columns"
        :request="loadData"
        :page-keys=" ['pageNum', 'pageSize', 'total']"
        :exportPermission="{ select: btnPermission.select, all: btnPermission.all }"
        :exportConfig="{ use: useExport, select: $route.meta.title, all: $route.meta.title }"
        :is-show-count-bar="false"
      >
        <template slot="prefix">
          <a-button
            v-btnPermission="btnPermission.add"
            type="primary"
            icon="plus"
            @click="handleAdd"
          >
            新增会议
          </a-button>
        </template>
        <span
          slot="status"
          slot-scope="text,record"
        >
          <list-status
            :status="record.meetingStatus"
            conversion="en"
          />
        </span>
        <span
          slot="operation"
          slot-scope="text,record"
        >
          <MoreButton>
            <!-- 插槽按钮 -->
            <slot v-if="$scopedSlots.hasOwnProperty('operation')" name="operation" :record="record" />
            <!-- 没有时使用默认 -->
            <template v-else>
              <span
                v-if="record.meetingStatus === '20'"
                v-btnPermission="btnPermission.detail"
              >
                <a @click="handleOperation(record,'detail')">会议详情</a>
              </span>
              <span
                v-if="(record.meetingStatus === '30' || record.meetingStatus === '50')&&hideBuquBtn()"
                v-btnPermission="btnPermission.enter"
              >
                <a @click="handleOperation(record,'enter')">进入会议</a>
              </span>
              <span
                v-if="record.meetingStatus === '40' || record.meetingStatus === '35'"
                v-btnPermission="btnPermission.view"
              >
                <a @click="handleOperation(record,'view')">查看会议</a>
              </span>
              <template v-if="useApprova">
                <a
                  v-if="record.meetingStatus === '35' || record.meetingStatus === '40' || record.meetingStatus === '50'"
                  @click="hadnleApprova(record)"
                >审批信息</a>
              </template>
            </template>
          </MoreButton>
        </span>
      </list-table>
      <!-- 表格 -->
    </a-card>
    <!-- 会 -->
  </div>
</template>
<script>
import { searchOption, columns } from './model.js'
import training from '@/api/design/training'
import listStatus from '@/components/list_status/meeting_status'
export default {
  name: 'MeetingList',
  props: {
    // 搜索表单配置
    searchOption: {
      type: Array,
      default: () => searchOption
    },
    // 会议列表表头
    columns: {
      type: Array,
      default: () => columns
    },
    // 会议类型
    meetingType: {
      type: String,
      require: true
    },
    // 新增页面路径
    addPath: {
      type: String,
      default: ''
    },
    // 操作页面路径
    operationPath: {
      type: String,
      default: ''
    },
    // 有审批
    useApprova: {
      type: Boolean,
      default: false
    },
    // 按钮权限(add:新增会议，detail:会议详情，enter:进入会议，view:查看会议)
    btnPermission: {
      type: Object,
      require: true
    },
    // 需要导出
    useExport:{
      type: Boolean,
      default: false
    }
  },
  components: {
    listStatus
  },
  data() {
    return {
      // 查询参数
      searchData: {},
      //表格数据加载
      loadData: async (q) => {
        const params = Object.assign(q, { param: this.searchData })
        if (this.searchData?.startEndDate?.length > 0) {
          params.param.startTime = this.searchData.startEndDate[0].format('YYYY-MM-DD') || void 0
          params.param.endTime = this.searchData.startEndDate[1].format('YYYY-MM-DD') || void 0
        }
        params.param.meetingType = this.meetingType
        delete params.startEndDate
        let res = await training.getPageMeeting(params)
        if (res.code === 200) {
          return { code: 200, data: res.data.list, ...res.data }
        }
        return { code: 200, data: [] }
      }
    }
  },
  methods: {
    /**
     * @description: 搜索
     * @param {Object} value 搜索数据
     * @return {Void}
     */
    search(value) {
      this.searchData = value || {}
      this.$refs.table.getData(null, true)
    },
    /**
     * @description: 新增会议
     * @param {Void}
     * @return {Void}
     */
    handleAdd() {
      this.$router.push({
        path: this.addPath
      })
    },
    /**
     * @description: 会议操作
     * @param {object} record
     * @param {string} pageType
     * @return {void}
     */
    handleOperation(record, pageType) {
      this.$router.push({
        path: this.operationPath,
        query: {
          id: record.id,
          meetingName: record.meetingName,
          pageType
        }
      })
    },
    /**
     * @description: 审批信息
     * @param {object} record
     * @return {void}
     */
    hadnleApprova(record) {
      this.$bus.$emit('showApprovalDetailsDialog', record.id)
    }
  }
}
</script>
<style lang="less" scoped>
</style>
